<!doctype html>
<html>

	<head>
		<meta charset="utf-8">
		<title></title>
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="css/mui.css" rel="stylesheet" />
		<link rel="stylesheet" type="text/css" href="iconfont/iconfont.css" />
	</head>

	<body>
		<header class="mui-bar mui-bar-nav" style="background-color: #ccc;">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<a id="zhaoxiangji" href="#popup" class="mui-pull-right iconfont icon-zhaoxiangji"
				style="color: white; line-height: 44px; font-size: 20px; margin-right: 5px;"></a>
		</header>
		<div class="mui-content" style="background-color: white;">
			<div id="1" style="width: 100%; height: 200px;">
				这里放置背景图片
			</div>
			<div>
				<ul class="mui-table-view">
					<li class="mui-table-view-cell mui-media">
						<a href="javascript:;">
							<img class="mui-media-object mui-pull-left" src="photo.jpg">
							<div class="mui-media-body">
								幸福
								<p class="mui-ellipsis">能和心爱的人一起睡觉，是件幸福的事情；可是，打呼噜怎么办？</p>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media">
						<a href="javascript:;">
							<img class="mui-media-object mui-pull-left" src="">
							<div class="mui-media-body">
								木屋
								<p class="mui-ellipsis">想要这样一间小木屋，夏天挫冰吃瓜，冬天围炉取暖.</p>
							</div>
						</a>
					</li>
					<li class="mui-table-view-cell mui-media">
						<a href="javascript:;">
							<img class="mui-media-object mui-pull-left" src="">
							<div class="mui-media-body">
								CBD
								<p class="mui-ellipsis">烤炉模式的城，到黄昏，如同打翻的调色盘一般.</p>
							</div>
						</a>
					</li>
				</ul>
			</div>
		</div>
		<div id="popup" class="mui-popover mui-popover-action" style="background-color: #ccc;">
			<ul class="mui-table-view" style="margin: 0;">
				<li class="mui-table-view-cell" ext="1">
					拍摄
				</li>
				<li class="mui-table-view-cell" ext="2">
					从相册选择
				</li>
			</ul>
			<ul class="mui-table-view" style="margin-left: 0; margin-right: 0; margin-bottom: 0;">
				<li class="mui-table-view-cell">
					<a href="#popup"><b>取消</b></a>
				</li>
			</ul>
		</div>
		<script src="js/mui.js"></script>
		<script type="text/javascript">
			mui.init();
			mui('#popup').on('tap', 'li', function() {
				var ext = this.getAttribute('ext');
				if (ext == '2') {
					plus.gallery.pick(function(files) {
						console.log(files);
						mui.openWindow({
							url: "friend_circle_send.html",
							extras: { files: files },
						});
					}, function(e) {
						console.log("取消选择图片");
					}, {
						filter: "image",
						multiple: true,
						maximum: 5,
						system: false,
						onmaxed: function() {
							plus.nativeUI.toast('微信:最多只能选择5张图片');
						}
					});
				}
			});
		</script>
	</body>

</html>
